<template>

  <div id="app" class="full-screen" style="overflow: hidden;">
		<!-- <div id="star-bg"></div> -->
    <router-view />
  </div>

</template>

<script>

import '@/lib/jquery-1.11.0.min.js';
import '@/lib/jquery.warpdrive.js';



export default {
  name: 'App',
	created() {
		// this.$post(this.$api.getAccessToken,{
		// 	accessKey: 'd9328a2452c548d99c95e350d58b8508',
		// 	secretKey: 'e7d920bd4dd34cfebf19bb4433eebe12'
		// }).then(res => {
		// 	if (res) {
		// 		let data = res.data;
		// 		if (data.code === 200) {
		// 			localStorage.setItem("token",data.data.token);
		// 			localStorage.setItem("mapId",data.data.mapId);
		// 		}
		// 	}
		// })
	},
	mounted() {
		var settings = {
		    width: 1920,/*width*/
		    height: 1080,/*height*/
		    autoResize: false,/*enable/disable autoResize*/
		    autoResizeMinWidth: null,/*set autoResize min width*/
		    autoResizeMaxWidth: null,/*set autoResize max width*/
		    autoResizeMinHeight: null,/*set autoResize min height*/
		    autoResizeMaxHeight: null,/*set autoResize max height*/
		    addMouseControls: true,/*enable/disable mouse controls*/
		    addTouchControls: true,/*enable/disable touch controls*/
		    hideContextMenu: true,/*enable/disable canvas context menu*/
		    starCount: 3333,/*count of active/moving stars*/
		    starBgCount: 2222,/*count of inactive/background stars*/
		    starBgColor: { r:255, g:255, b:255 },/*background stars color*/
		    starBgColorRangeMin: 10,/*background stars color range min of starBgColor*/
		    starBgColorRangeMax: 40,/*background stars color range max of starBgColor*/
		    starColor: { r:255, g:255, b:255 },/*stars color*/
		    starColorRangeMin: 10,/*stars color range min of starBgColor*/
		    starColorRangeMax: 100,/*stars color range max of starBgColor*/
		    starfieldBackgroundColor: { r:0, g:0, b:0 ,a:0.1},/*background color*/
		    starDirection: 1,/*stars moving in which direction*/
		    starSpeed: 15,/*stars moving speed*/
		    starSpeedMax: 20,/*stars moving speed max*/
		    starSpeedAnimationDuration: 3,/*time in seconds from starSpeed to starSpeedMax*/
		    starFov: 300,/*field of view*/
		    starFovMin: 200,/*field of view min*/
		    starFovAnimationDuration: 2,/*time in seconds from starFov to starFovMin*/
		    starRotationPermission: true,/*enable/disable rotation*/
		    starRotationDirection: 1,/*rotation direction*/
		    starRotationSpeed: 0.0,/*rotation speed*/
		    starRotationSpeedMax: .5,/*rotation speed max*/
		    starRotationAnimationDuration: 2,/*time in seconds from starRotationSpeed to starRotationSpeedMax*/
		    starWarpLineLength: 1.2,/*line length*/
		    starWarpTunnelDiameter: 50,/*tunnel diameter*/
		    starFollowMouseSensitivity: 0.020,/*mouse follow sensitivity*/
		    starFollowMouseXAxis: false,/*enable/disable mouse follow x axis*/
		    starFollowMouseYAxis: false/*enable/disable mouse follow y axis*/
		};

		// $('#star-bg').warpDrive(settings);

		// console.log($('#sta-bg > canvas'));

	}
}





</script>

<style lang="scss">

@import '@/assets/style/common.scss';
@import '@/assets/style/override.scss';
@import '@/assets/style/government.scss';

@import '@/assets/style/bg.scss';

html,body {
  width: 100%;
  height: 100%;
	padding: 0;
	margin: 0;
}
#star-bg {
	position: absolute;
	// width: 1920px;
	// height: 1080px;
	background: transparent;
	// top: 0;
	// left: 0;
	// right: 0;
	// bottom: 0;
	// padding: 0;
	// margin: 0;
	>canvas {
		display: block;
	}
}

.el-dialog {
  background-color: rgba(14,44,74,0.9) !important;
  margin: 200px 900px 50px auto !important;
  position: relative;
  z-index: 10000;
}
.el-dialog__header > .el-dialog__title{
  color: #FFF !important;
}
.el-dialog__headerbtn .el-dialog__close {
  color: #CCC !important;
}

.el-carousel__item.is-animating {
      -webkit-transition: -webkit-transform 1.5s ease-in-out;
      transition: -webkit-transform 1.5s ease-in-out;
      transition: transform 1.5s ease-in-out;
      transition: transform 1.5s ease-in-out, -webkit-transform 1.5s ease-in-out;
      transition: transform 1.5s ease-in-out,-webkit-transform 1.5s ease-in-out;
}

.info-window {
  background-color: rgba(0,0,0,0.7);
  padding: 10px;
  border-radius: 10px;
  width: 200px;
  >p {
    line-height: 24px;
  }
}

  .el-input--mini .el-input__inner {
      width: 80px !important;
      border: 0;
      color: #FFF;
      background-color: transparent;
      font-size: 14px;
      text-align: right;
  }

  .el-select-dropdown {
    text-align: center;
    background-color: rgb(2,34,78);
    border-color: rgb(2,34,78);
  }
  .el-select-dropdown__item {
    color: #FFF !important;
  }
  .el-select-dropdown__item.hover, .el-select-dropdown__item:hover {
    background-color: #026FF3;
  }
  .popper__arrow {
    left: 40px !important;
  }
</style>
